var popup;

function get_filename(){
    var url = window.location.pathname;
    var filename = url.substring(url.lastIndexOf('/')+1);
    return filename;
}

function generar_popup_marcador(marker){
    google.maps.event.addListener(marker, 'click', function() {
        if (!popup) {
            popup = new google.maps.InfoWindow();
        }
        var contenido = "<div style='width: 200px; height: 250px;'>" + 
        "<h2>" + 
            "<a href='recurso.php?idrecurso=" + marker.idrecurso + "'>" + 
            marker.title + 
            "</a>" + 
        "</h2>" +
        "<p style='font-size: 10px;'>" + marker.info + "</p>" + 
        "</div>";
        popup.setContent(contenido);
        popup.open(elmapa, marker);
        elmapa.setCenter(marker.getPosition());
        if (elmapa.getZoom() <= 9) {
            elmapa.setZoom(9);
        }
    })
}

function como_llegar(){
    var myloc = new google.maps.Marker({
        clickable: false,
        icon: new google.maps.MarkerImage('//maps.gstatic.com/mapfiles/mobile/mobileimgs2.png',
        new google.maps.Size(22,22),
        new google.maps.Point(0,18),
        new google.maps.Point(11,11)),
        shadow: null,
        zIndex: 999,
        map: elmapa
    });
    
    if (navigator.geolocation) navigator.geolocation.getCurrentPosition(function(pos) {
        var me = new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude);
        myloc.setPosition(me);
        
        var bounds = new google.maps.LatLngBounds();
        bounds.extend(me);
        bounds.extend(myLatlng);
        elmapa.fitBounds (bounds);
        
        var directionsService = new google.maps.DirectionsService();
        var directionsDisplay = new google.maps.DirectionsRenderer();

        var travel = {
            origin : me,
            destination : myLatlng,
            travelMode : google.maps.DirectionsTravelMode.DRIVING
        }
        directionsDisplay.setMap(elmapa);
        directionsService.route(travel, function(result, status) {
            if (status === google.maps.DirectionsStatus.OK) {
                directionsDisplay.setDirections(result);
            }
        });
        
    }, function(error) {
        alert("Ha ocurrido un error al buscar la ruta");
        console.log(error);
    });
    
}

function alrededor(){
    
    $.ajax({
        url: 'alrededor.php',
        dataType: 'json',
        data: {
            'idrecurso': $('#idrecurso').val()
        },
        success: function(response){
            $(response).each(function(i, el){
                var marker = new google.maps.Marker({
                    position: new google.maps.LatLng(el.x, el.y),
                    idrecurso: el.idrecurso,
                    title: el.recurso_nombre,
                    info: el.recurso_caracteristicas
                });
                marker.setMap(elmapa);
                generar_popup_marcador(marker);
            })
        },
        error: function(response){
            console.log(response);
        }
    })
    
}

function initialize_map(idrecurso, name, lat, lon, caracteristicas){

    myLatlng = new google.maps.LatLng(lat, lon);
    var myOptions = {
        zoom: 15,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    elmapa = new google.maps.Map( document.getElementById( "map_canvas" ), myOptions );

    var marker = new google.maps.Marker({
        position: myLatlng,
        idrecurso: idrecurso,
        title: name,
        info: caracteristicas
    });

    // To add the marker to the map, call setMap();
    marker.setMap(elmapa);
    generar_popup_marcador(marker);
}

$(document).bind( "pageinit", function( e, data ) {
    pageid = $(e.target).attr("id");
    
    if (pageid == 'recurso'){
        Galleria.loadTheme('css/galleria/themes/classic/galleria.classic.min.js');
        Galleria.configure({
            imageCrop: true,
            transition: 'fade'
        });
        $('#galleria').galleria({
            height: 300
        });
    } else if (pageid == 'map') {
        /*var nombre = $("#mapname").val();
        var lat = $("#lat").val();
        var lon = $("#lon").val();
        initialize_map(nombre, lat, lon);*/
    }
    
});